@import "../../assets/style/_var.less";
.rotate-180 {
  transform: rotate(180deg);
  // transition: .3s;
}
page {
  height: 100vh;
}
.wrap {
  overflow: auto;
  padding-bottom: calc(40rpx + constant(safe-area-inset-bottom));
  padding-bottom: calc(40rpx + env(safe-area-inset-bottom));
}
.section {
  margin: 0 32rpx;
  margin-top: 32rpx;
  .title {
    font-size: @font-size-heavy;
    font-weight: 500;
    margin-bottom: 20rpx;
  }
}
.history-list {
  @size: 48rpx;
  .item {
    padding: 0 20rpx;
    height: @size;
    line-height: @size;
    max-width: 300rpx;
    border-radius: @size*0.5;
    background: @color-bg-lighter;
    margin-bottom: 20rpx;
    &:not(:last-child) {
      margin-right: 20rpx;
    }
  }
  .icon-fold {
    height: @size;
    width: @size*1.5;
    border-radius: @size*0.5;
    background: @color-bg-lighter;
  }
}
.search-list {
  .item {
    height: @height-main;
    .num {
      @size: 38rpx;
      height: @size;
      width: @size;
      line-height: @size;
      text-align: center;
      font-size: 26rpx;
      font-weight: bold;
      margin-right: 16rpx;
      border-radius: 8rpx;
      background: @color-bg-lighter;
    }
    &:nth-child(2) .num {
      font-size: 26rpx;
      background: red;
    }
    &:nth-child(3) .num {
      font-size: 26rpx;
      background: @color-theme;
    }
    &:nth-child(4) .num {
      font-size: 26rpx;
      background: rgb(211, 150, 76);
    }
    .tag {
      @size: 32rpx;
      border-radius: 8rpx;
      height: @size;
      width: @size;
      line-height: @size;
      text-align: center;
      font-size: 24rpx;
      margin-left: 12rpx;
      &.new {
        color: #cccccc;
        background: #00be8c;
      }
    }
  }
}
